<template>
  <el-select v-model="formValue" :multiple="multiple" v-bind="$attrs" style="width:100%">
    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
  </el-select>
</template>

<script>
export default {
  name: "FGSelect",
  model: {
    prop: "value", // 绑定的值，通过父组件传递
    event: "update",
  },
  props: {
    value: {
      type: [String, Number],
      default: "",
    },
    options: {
      type: Array,
      default: () => [],
    },
    multiple: {
      type: Boolean,
      default: false,
    },
  },
  computed: {
    formValue: {
      get() {
        if (!this.multiple) return this.value;
        if (this.value) return this.value.split(",");
        return [];
      },
      set(val) {
        const value = this.multiple ? (val ? val?.join(",") : "") : val;
        console.log("value", value);
        this.$emit("update", value);
      },
    },
  },
};
</script>

<style lang="scss" scoped>
</style>